<template>
	<video-player  class="video-player vjs-custom-skin" id="videoPlayer"
	     ref="videoPlayer"
	     :playsinline="true"
	     :options="videoOptions"
	      @play="onPlayerPlay($event)"
	     @timeupdate="onPlayerTimeupdate($event)"
	></video-player>
</template>
<script >
	
	// import 'videojs-flash';
	// import SWF_URL from 'videojs-swf/dist/video-js.swf';
	var player = null;
	export default {
		props:['playParam'],
	    data() {
		    return {
		    	videoOptions: {
		    		loop: false,
		    		height: '360',
		    		sources: [{
		    			type: "rtmp/mp4",
		    			src: "blala"
		    		}],
		    		// techOrder: ['flash'],
		    		autoplay: false,
		    		controls: true,
		    		poster: "",
		    		controlBar: {
		    			timeDivider: true,
		    			durationDisplay: true,
		    			remainingTimeDisplay: false,
			          fullscreenToggle: true  //全屏按钮
			      	},
			      	// flash: {swf: SWF_URL },
			  	},
			}

		},
		mounted(){
			this.initPlay();
		},
		methods:{
			initPlay(){
				this.$refs.videoPlayer.player.src({ type : "rtmp/mp4", src : this.playParam.play_url }) ;
			},
			onPlayerPlay(){


			},
			onPlayerTimeupdate(){
				console.info(this.playParam.end_time,this.$refs.videoPlayer.player.currentTime())
				if( !is_empty( this.playParam.end_time ) && !is_empty( this.playParam.end_time ) ){
					//小于开始时间，从开始时间播放
					if( this.$refs.videoPlayer.player.currentTime() < this.playParam.start_time  ){
						setTimeout( () => {
							this.$refs.videoPlayer.player.currentTime( this.playParam.start_time ) ;
						},100)
						
					}
					//大于结束时间，播放停止
					else if( this.$refs.videoPlayer.player.currentTime() > this.playParam.end_time ){
						setTimeout( () => {
							this.$refs.videoPlayer.player.currentTime( this.playParam.start_time ) ;
							this.$refs.videoPlayer.player.pause();
						},100)
					}

				}
			},
		}
	}
</script>
